<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/bootstrap/easyui.css">   
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/icon.css">
<!-- 引入Js -->
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>
<title>Insert title here</title>
</head>
<script type="text/javascript">
$(function(){
	var pager=$("#workerlist").datagrid('getPager');
	pager.pagination({
	pageList:[10,20,30],
	});
});
//删除员工的功能
function delworker() {
	var data=$("#workerlist").datagrid('getSelections');
    if(data.length==0){
    	$.messager.show({
    		title:'警告',
    		msg:'请选择你要删除的数据',
    		timeout:1000,
    		showType:'slide',
    		style:{
    			left:50,
    			right:'',
    			top:100
    		}
    	});
                }else {
		//声明一个数组wid
		var wids=[];
		for (var i = 0; i < data.length; i++) {
			wids.push(data[i].wid)
		}
		$.messager.confirm('学生数据确认', '确认是否删除'+data.length+'这些数据？', function(r){
			if (r){
			    $.ajax({
			    	type:"post",
			    	url:"workerlists",
			    	data:{"wids":wids},
			    	dataType:"text",
			    	success:function(data){
			    	   if(data=="1"){
			    		 //提示删除成功
			    		  $.messager.alert("提示","删除成功",'info',function(){
			    				$("#workerlist").datagrid('reload');
			    			});   
			    	   }else {
			    		 //提示删除失败
			    		  $.messager.alert("提示","删除失败")
					}
			    	}
			    });
			}else {
				$("#workerlist"),datagrid("uncheckAll");
			}
		});
	}
}
//显示添加员工的框
function showaddworker() {
	$("#addwin").window("open");
}
//清楚添加窗口中信息
function clearfrom(){
	
	$("#addform").form("clear")
}
//添加员工信息时输入部门ID 验证信息
$(function(){
	$(".addid").blur(function(){
		//获取输入框的值
		var did=$(this).val();
		var dname=$(".addname").attr("value");
		if(did==""){
			$.messager.alert('提示','请输入部门ID','info',function(){
				$("#addform").form('clear');
			});
		}else{
			$.ajax({
				type:"post",
				url:"updatevalitdep",
				data:{"did":did},
				dataType:"text",
				success:function(data){
					if(data!="null"){
						$.messager.alert('提示','部门存在,请继续输入添加信息','info',function(){
						$(".addname").attr("value",data); 
						});
					}else{
						$.messager.alert('提示','部门不存在，请重新输入','info',function(){
						$("#addform").form('clear');
						 $("#addwin").window("close");
						});
					}
				}
			})
		}
	});
});
//员工添加
function addworker() {
	$("#addform").form('submit',{
		 success:function(){
			 $("#addwin").window("close"); //提交成功关闭添加员工窗口
			 //刷新员工页面
			 $.messager.alert("提示","添加成功",'info',function(){
 				$("#workerlist").datagrid('reload');
 			});   
		 }
		
	});
}
//显示修改窗口
function showupdateworker() {
	var data=$("#workerlist").datagrid('getSelections')
	 if(data.length!=1){
	    	$.messager.show({
	    		title:'警告',
	    		msg:'请选择你要修改的数据',
	    		timeout:1000,
	    		showType:'slide',
	    		style:{
	    			left:150,
	    			right:'',
	    			top:100
	    		}
	    	});
	   }else{
	      $("#updatewin").window("open");
	      var wids=[];
	      for (var i= 0; i < data.length; i++) {
			wids.push(data[i].wid);
		}
		$("#wid").attr("value",wids[0]);
	   }
}
//验证自动输入部门名称
$(function(){
	$(".updatedid").blur(function(){
		//获取输入框的值
		var did=$(this).val();
		var dname=$(".updatedname").attr("value");
		if(did==""){
			$.messager.alert('提示','请输入部门ID','info',function(){
				$("#updateform").form('clear');
			});
		}else{
			$.ajax({
				type:"post",
				url:"updatevalitdep",
				data:{"did":did},
				dataType:"text",
				success:function(data){
					if(data!="null"){
						$.messager.alert('提示','部门存在,请继续修改','info',function(){
						$(".updatedname").attr("value",data); 
						});
					}else{
						$.messager.alert('提示','部门不存在，请重新输入','info',function(){
						$("#updateform").form('clear');
						});
					}
				}
			})
		}
	});
});
//修改
function updateworker() {
	var data=$("#workerlist").datagrid('getSelections')
	$("#updateform").form('submit',{
	 success:function(data){
	    	if(data=="1"){
	    		$("#updatewin").window("close");
	    		$.messager.alert("提示","修改成功",'info',function(){
	  			$("#workerlist").datagrid('reload');
	    		});
	    	}else{
	    		alert("修改失败");
	    	}
	    }
	});
}
//取消修改
function closewin() {
	$("#updatewin").window("close");
}
</script>
<body>
    <table id="workerlist" title="职工信息" class="easyui-datagrid"
            url="getAll" 
            toolbar="#toolbar" pagination="true" fit="true" border="false"
            rownumbers="true" fitColumns="true" >
        <thead>
            <tr>
                <th field="ck" checkbox="true"></th>
                <th field="wid" width="25" hidden="ture">员工ID</th>
                <th field="wname" width="30" resizable="false">员工姓名</th>
                <th field="wage" width="25">员工年龄</th>
                <th field="wsex" width="25">员工性别</th>
                <th field="wphone" width="50">员工电话</th>
                <th field="wadress" width="50">员工地址</th>
                <th field="did" width="25" hidden="ture">员工部门ID</th>
                <th field="dname" width="25">员工部门</th>
                <th field="work_age" width="25">员工工龄</th>
            </tr>
        </thead>
    </table>
    <div id="toolbar">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="showaddworker()">增加</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="showupdateworker()">修改</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="delworker()">删除</a>
    </div>
     <!-- 添加员工信息 -->
   <div id="addwin" class="easyui-window" title="添加员工信息" data-options="modal:true"  closed="true" style="width:300px;height:400px;">
    <form id="addform" method="post" action="addworker" style="padding:10px 20px 10px 40px;">
     <p>员工姓名: <input name="wname" class="easyui-textbox" missingMessage="请输入员工姓名"></p>
     <p>员工年龄: <input name="wage" class="easyui-textbox" missingMessage="请输入员工年龄"></p>
     <p>员工性别: <input name="wsex" class="easyui-textbox" missingMessage="请输入员工性别"></p>
     <p>员工电话: <input name="wphone" class="easyui-textbox" missingMessage="请输入员工电话"></p>
     <p>员工地址: <input name="wadress" class="easyui-textbox" missingMessage="请输入员工地址"></p>
     <p>部门ID: <input name="did" class="addid" class="easyui-textbox" missingMessage="请输入员工所在部门ID"></p>
     <p>部门名称: <input name="dname" class="addname" readonly="readonly"></p>
     <p>员工工龄: <input name="work_age" class="easyui-textbox" missingMessage="请输入员工工龄"></p>
      <div style="padding:5px;text-align:center;">
    	<a href="#" class="easyui-linkbutton" icon="icon-ok" onclick="addworker()">确认</a>
    	<a href="#" class="easyui-linkbutton" icon="icon-cancel"onclick="clearfrom()">清除</a>
      </div>
      </form>
     </div>
     <!-- 修改员工数据 -->
      <div id="updatewin" class="easyui-window" title="修改员工信息" closed="true" data-options="modal:true" style="width:300px;height:400px;">
    <form id="updateform" method="post" action="updateworker" style="padding:10px 20px 10px 40px;">
     <input id="wid"  name="wid" class="easyui-validatebox" hidden="ture">
     <p>员工姓名: <input name="wname" class="easyui-textbox" missingMessage="请输入员工姓名"></p>
     <p>员工年龄: <input name="wage" class="easyui-textbox" missingMessage="请输入员工年龄"></p>
     <p>员工性别: <input name="wsex" class="easyui-textbox" missingMessage="请输入员工性别"></p>
     <p>员工电话: <input name="wphone" class="easyui-textbox" missingMessage="请输入员工电话"></p>
     <p>员工地址: <input name="wadress" class="easyui-textbox" missingMessage="请输入员工地址"></p>
     <p>部门ID: <input name="did" class="updatedid" class="easyui-textbox" missingMessage="请输入员工所在部门ID"></p>
     <p>部门名称: <input name="dname" class="updatedname" readonly="readonly"></p>
     <p>员工工龄: <input name="work_age" class="easyui-textbox" missingMessage="请输入员工工龄"></p>
      <div style="padding:5px;text-align:center;">
    	<a href="#" class="easyui-linkbutton" icon="icon-ok" onclick="updateworker()">确认</a>
    	<a href="#" class="easyui-linkbutton" icon="icon-cancel"onclick="closewin()">取消</a>
      </div>
      </form>
     </div>
    
</body>
</html>